<template>
    <!--菜单有子层级-->
    <el-sub-menu v-if="data.children" :index="data.id">
        <template #title>{{ data.name }}</template>
        <BaseMenuItem v-for="item in data.children" :key="item.id" :data="item" />
    </el-sub-menu>
    <!--没有子层级-->
    <el-menu-item v-else :index="data.id">{{ data.name }}</el-menu-item>
</template>

<script lang="ts" setup>
/**
 * @ClassName BaseMenuItem
 * @Description 菜单项，可以是带嵌套的菜单项
 * @Author xuyizhuo
 * @Date 2024/7/5 10:03
 */
import type { BaseMenuData } from './BaseMenuType'

defineProps<{ data: BaseMenuData }>()
</script>

<style lang="scss" scoped></style>
